<template>
  <div class="page-wrapper">
    <div class="prefer-main">
      <router-link class="item-link" :to="'/goods/nounDetail?id=' + item.productId" v-for="(item,index) in goodsInfo" :key="index">
        <div class="item">
          <img class="item-img" lazy-load="true" :src="item.picUrl" mode="aspectFill"/>
          <div class="item-title">{{item.productName}}</div>
          <div class="item-price">{{item.exchangePoints}}积分</div>
        </div>
      </router-link>
    </div>
  </div>
</template>

<script>
import { API } from '../../config'
export default{
  data(){
    return {
        modalStatus: true,
        goodsInfo: [],
        pageNum: 1,
        pageSize: 10,
    }
  },
  methods:{
    initFun() {
        let vm = this
        vm.getList();
    },
    getList(pageNum) { 
        let vm = this
        const params = {
            pageNum: pageNum || 1,
            pageSize: vm.pageSize,
        }
        vm.goodsInfo = params.pageNum === 1 ? [] : vm.goodsInfo
        vm.$axios.get(API + '/product/selGroupBuy/' + vm.pageNum + '/' + vm.pageSize).then((res) => {
            if (res.data.code === 200) {
                vm.goodsInfo = [...vm.goodsInfo, ...res.data.data.data]
                if (vm.goodsInfo.length < vm.pageSize) {
                    vm.loadingShow = 0
                } else if (res.data.data.data && res.data.data.data.length === 0) {
                    vm.loadingShow = 2
                } else {
                    vm.loadingShow = 1
                }
            }
        })
    }
  },
  mounted() {
    let vm = this
    vm.initFun()
  }
}
</script>

<style lang='less' scoped>
@import '../../css/goods/nounList.less';
</style>
